<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
	pageEncoding="ISO-8859-1"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<script type="text/javascript" src="<c:url value="/assets/js/ezops/lifecycleevent.js"/>"></script>
<script type="text/javascript">
	$(document).ready(function(){
		 /**
         * To handle left menu toggle on page load
         */
    	$('#operation_li').addClass('root-level has-sub opened');
    	$('#operation_li_ul').toggle('click').addClass('visible');
    	$('#operation_li_ul').attr('style','');
        $('#operation_li_ul_li_' + 3).attr('style','font-weight: bold;');
	});

</script>
<div class="row">
	<div class="col-md-12">
		<div class="row pull-bottom"></div>
		<!-- /.Manage your Asseccment Start -->
		<div class="row">
			<div class="col-lg-12">
				<!--   file status table Section Start -->
				<div class="panel panel-default">
					<div class="panel-heading">
						<div class="panel-title">
							<strong>Life Cycle Events</strong>
						</div>
					</div>
					<!-- /.panel-heading -->
					<div class="panel-body">
						<div id='jqxWidget'>
							<div id='jqxTabs'>
								<ul>
									<li>Open Trades</li>
									<li>Upcoming Settlement</li>
									<!-- <li>Resets</li> -->
								</ul>
								<div>
									<div class="search-panel">
									<div>
									<span class="add-on"> <i class="glyphicon glyphicon-calendar icon-calendar"></i>
											</span> <input type="text" style="width: 200px; margin-right: 15px"
												name="dateRange" id="dateRange" value="" placeholder="Click to select Range..."/>
												<button type="button" style="margin-right: 15px" id="searchOpenTrades" class="btn">Search</button>
												<button type="button" style="margin-right: 15px" id="refeshOpenTrades" class="btn">Refresh</button>
										</div>
											   <div class="dropdown columnheading">
													<dt>
														<a href="#">
														<span> Column Settings 
														<i class="entypo-down-open"></i></span>
															<p class="multiSel"></p>
														</a>
													</dt>
													<dd>
														<div class="reportFilter">
															<ul class="columnsettings">
															<!-- Id of all li element must be same as datafield of jqxGrid in order to hide and show, because
															hide and show triggered via datafield name of grid -->
																<li><input type="checkbox" name="productDescription" id="productDescription" checked="checked" onClick="showhide_datatable1(this)">Product Description<br></li>
																<li><input type="checkbox" name="accrual" id="accrual" checked="checked" onClick="showhide_datatable1(this)">Accrual<br></li>
																<li><input type="checkbox" name="partyId" id="partyId" checked="checked" onClick="showhide_datatable1(this)">Party Id<br></li>
																<li><input type="checkbox" name="settleCurrency" id="settleCurrency" checked="checked" onClick="showhide_datatable1(this)">SettleCurrency<br></li>
																<li><input type="checkbox" name="quantity" id="quantity" checked="checked" onClick="showhide_datatable1(this)">Quantity<br></li>
																<li><input type="checkbox" name="bookId" id="bookId" checked="checked" onClick="showhide_datatable1(this)">BookId<br></li>
																<li><input type="checkbox" name="brokerId" id="brokerId" checked="checked" onClick="showhide_datatable1(this)">BrokerId<br></li>
																<li><input type="checkbox" name="buySell" id="buySell" checked="checked" onClick="showhide_datatable1(this)">BuySell<br></li>
																<li><input type="checkbox" name="entityId" id="entityId" checked="checked" onClick="showhide_datatable1(this)">EntityId<br></li>
																<li><input type="checkbox" name="fees" id="fees" checked="checked" onClick="showhide_datatable1(this)">Fees<br></li>
																<li><input type="checkbox" name="id" id="id" checked="checked" onClick="showhide_datatable1(this)">Id<br></li>
																<li><input type="checkbox" name="price" id="price" checked="checked" onClick="showhide_datatable1(this)">Price<br></li>
																<li><input type="checkbox" name="priceType" id="priceType" checked="checked" onClick="showhide_datatable1(this)">PriceType<br></li>
																<li><input type="checkbox" name="riskMaturity" id="riskMaturity" checked="checked" onClick="showhide_datatable1(this)">RiskMaturity<br></li>
																<li><input type="checkbox" name="settleAmount" id="settleAmount" checked="checked" onClick="showhide_datatable1(this)">SettleAmount<br></li>
																<li><input type="checkbox" name="settlementDate" id="settlementDate" checked="checked" onClick="showhide_datatable1(this)">SettlementDate<br></li>
																<li><input type="checkbox" name="tradeTime" id="tradeTime" checked="checked" onClick="showhide_datatable1(this)">TradeTime<br></li>
																<li><input type="checkbox" name="workflowSubType" id="workflowSubType" checked="checked" onClick="showhide_datatable1(this)">WorkflowSubType<br></li>
																<li><input type="checkbox" name="lastEventType" id="lastEventType" checked="checked" onClick="showhide_datatable1(this)">LastEventType<br></li>
																<li><input type="checkbox" name="status" id="status" checked="checked" onClick="showhide_datatable1(this)">Status<br></li>
																<li><input type="checkbox" name="mtMBookingStatus" id="mtMBookingStatus" checked="checked" onClick="showhide_datatable1(this)">MTMBookingStatus<br></li>
															</ul>
														</div>
													</dd>
												</div>
									</div>
									<div id="dataTable"></div>
								</div>
								<div>
									<div class="search-panel">
									<div>
									<span class="add-on"> <i class="glyphicon glyphicon-calendar icon-calendar"></i>
											</span> <input type="text" style="width: 200px; margin-right: 15px"
												name="dateRange" id="dateRange-upcoming" value="" placeholder="Click to select Range..."/>
												<button type="button" style="margin-right: 15px" id="searchUpcomingSettlement" class="btn">Search</button>
												<button type="button" style="margin-right: 15px" id="refeshUpcomingSettlement" class="btn">Refresh</button>
										</div>
											   <div class="dropdown columnheading">
													<dt>
														<a href="#">
														<span> Column Settings 
														<i class="entypo-down-open"></i></span>
															<p class="multiSel"></p>
														</a>
													</dt>
													<dd>
														<div class="reportFilter">
															<ul class="columnsettings">
															<!-- Id of all li element must be same as datafield of jqxGrid in order to hide and show, because
															hide and show triggered via datafield name of grid -->
																<li><input type="checkbox" name="productDescription" checked="checked" onClick="showhide_datatable2(this)">Product Description<br></li>
																<li><input type="checkbox" name="accrual" checked="checked" onClick="showhide_datatable2(this)">Accrual<br></li>
																<li><input type="checkbox" name="partyId" checked="checked" onClick="showhide_datatable2(this)">Party Id<br></li>
																<li><input type="checkbox" name="settleCurrency" checked="checked" onClick="showhide_datatable2(this)">SettleCurrency<br></li>
																<li><input type="checkbox" name="quantity" checked="checked" onClick="showhide_datatable2(this)">Quantity<br></li>
																<li><input type="checkbox" name="bookId" checked="checked" onClick="showhide_datatable2(this)">BookId<br></li>
																<li><input type="checkbox" name="brokerId" checked="checked" onClick="showhide_datatable2(this)">BrokerId<br></li>
																<li><input type="checkbox" name="buySell" checked="checked" onClick="showhide_datatable2(this)">BuySell<br></li>
																<li><input type="checkbox" name="entityId" checked="checked" onClick="showhide_datatable2(this)">EntityId<br></li>
																<li><input type="checkbox" name="fees" checked="checked" onClick="showhide_datatable2(this)">Fees<br></li>
																<li><input type="checkbox" name="id" checked="checked" onClick="showhide_datatable2(this)">Id<br></li>
																<li><input type="checkbox" name="price" checked="checked" onClick="showhide_datatable2(this)">Price<br></li>
																<li><input type="checkbox" name="priceType" checked="checked" onClick="showhide_datatable2(this)">PriceType<br></li>
																<li><input type="checkbox" name="riskMaturity" checked="checked" onClick="showhide_datatable2(this)">RiskMaturity<br></li>
																<li><input type="checkbox" name="settleAmount" checked="checked" onClick="showhide_datatable2(this)">SettleAmount<br></li>
																<li><input type="checkbox" name="settlementDate" checked="checked" onClick="showhide_datatable2(this)">SettlementDate<br></li>
																<li><input type="checkbox" name="tradeTime" checked="checked" onClick="showhide_datatable2(this)">TradeTime<br></li>
																<li><input type="checkbox" name="workflowSubType" checked="checked" onClick="showhide_datatable2(this)">WorkflowSubType<br></li>
																<li><input type="checkbox" name="lastEventType" checked="checked" onClick="showhide_datatable2(this)">LastEventType<br></li>
																<li><input type="checkbox" name="status" checked="checked" onClick="showhide_datatable2(this)">Status<br></li>
																<li><input type="checkbox" name="mtMBookingStatus" checked="checked" onClick="showhide_datatable2(this)">MTMBookingStatus<br></li>
															</ul>
														</div>
													</dd>
												</div>
									</div>
									<div id="dataTable2"></div>
								</div>
								<!-- <div>ASP.NET is a web application framework developed and
									marketed by Microsoft to allow programmers to build dynamic web
									sites, web applications and web services. It was first released
									in January 2002 with version 1.0 of the .NET Framework, and is
									the successor to Microsoft's Active Server Pages (ASP)
									technology. ASP.NET is built on the Common Language Runtime
									(CLR), allowing programmers to write ASP.NET code using any
									supported .NET language. The ASP.NET SOAP extension framework
									allows ASP.NET components to process SOAP messages.</div> -->
							</div>
							<!-- /.table-responsive -->
						</div>
						<!-- /.panel-body -->
					</div>
				</div>
				<!-- /.col-lg-12 -->
			</div>
			<!-- /#page-wrapper -->
		</div>
	</div>